import React, { Component } from 'react'
import { Button, Toast } from 'antd-mobile'
import MynavBar from '../../components/MyNavBar/index'
import styles from './index.module.scss'
import { userLogin } from '../../api/index'
import { setToken } from '../../utils/auth'
export default class Login extends Component {
state = {
  username:'test3',
  password:'test3'
}
componentDidMount(){

}
onSubmit = async (e) =>{
  const { username,password } = this.state
  e.preventDefault()
  const res = await userLogin({username,password})
  const { body,description,status } = res.data
  if (status === 200) {
    // 1.把token保存到本地存储
    const token = body.token
    // localStorage.setItem('HKZF_TOKEN',token)
    setToken(token)
    // 2.返回上一页
    this.props.history.goBack()
  } else {
    Toast.info(description,1.5)
  }
}
// getUsername = (e) =>{
//   // console.log(e.target.value);
//   this.setState({
//     username:e.target.value
//   })
// }
// getPassword = (e) =>{
//   this.setState({
//     password:e.target.value
//   })
// } 
getInputValue=(e) => {
  // 更新状态中的表单值
  this.setState({
    [e.target.name]:e.target.value
  })
}
  render() {
    const { username,password } = this.state
    return (
      <div className={styles.login}>
        <MynavBar>账号登录</MynavBar>
        <form className={styles.form}>
          <input name="username" type="text" className={styles.form_input} placeholder='请输入账号' value={username} onChange={this.getInputValue} />
          <input name="password" type="password" className={styles.form_input} placeholder='请输入密码' value={password} onChange={this.getInputValue} />
          <Button onClick={this.onSubmit} type="primary">登录</Button>
        </form>
      </div>
    )
  }
}
